* {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}

html, body {
    width: 100%;
    height: 100%;
    background-color: #f4f4f4;
    color: black;
    overflow-x: hidden;
}

.wapper {
    width: 100%;
    height: 100%;
}

/* 顶部导航及广告栏 */
.wapper .top-nav-wrap {
    width: 100%;
    height: 105px;
}

.wapper .top-nav-wrap .top-nav {
    width:1190px;
    height:35px;
    margin:0 auto;
}

.wapper .top-nav-wrap .top-nav .top-nav-l{
    float: left;
}

.wapper .top-nav-wrap .top-nav .top-nav-r{
    float: right;
}

.wapper .top-nav-wrap .top-nav li {
    float: left;
    margin-right: 7px;
}

.wapper .top-nav-wrap .top-nav a{
    color:#6c6c6c;
    display: inline-block;
    font-size: 13px;
    height: 35px;
    line-height: 35px;
    padding-right: 6px;
}

.wapper .top-nav-wrap .top-nav a:hover{
    color: #f40;
    font-weight: bold;
}

.wapper .top-nav-wrap .top-nav .top-nav-menu .login {
    color: #f40;
    font-weight: bold;
}

.wapper .top-nav-wrap .top-nav .top-nav-menu .bg-pic.pic_xsj {
    display: inline-block;
    width: 6px;
    height: 3px;
    background-image: url(../pic/xsj.png);
    background-size: 100% 100%;
    vertical-align: middle;/*垂直方向上是居中对齐*/
}

.wapper .top-nav-wrap .top-nav .top-nav-menu .bg-pic.shoppingcar {
    display: inline-block;
    width: 12px;
    height: 12px;
    background-image: url(../pic/gwc.png);
    background-size: 100% 100%;
    vertical-align: middle;/*垂直方向上也是居中对齐*/
}

.wapper .top-nav-wrap .top-nav .top-nav-menu .bg-pic.star {
    display: inline-block;
    width: 12px;
    height: 12px;
    background-image: url(../pic/star.png);
    background-size: 100% 100%;
    vertical-align: middle;/*垂直方向上也是居中对齐*/
}

.wapper .top-nav-wrap .top-nav .top-nav-menu.split span {
    line-height: 35px;
    color:#ddd;
}

.wapper .top-ad {
    background-color: #4c174d;
}

.wapper .top-ad .ad{
    width: 1190px;
    height:70px;
    margin: 0 auto;
}


/* 搜索框部分 */
.wapper .search-wrap {
    width: 100%;
    height: 97px;
    padding-top: 24px;
    background-color: #fff;
}

.wapper .search-wrap .search-content {
    width:1190px;
    height:88px;
    margin: 0 auto;
    position: relative;
}

.wapper .search-wrap .search-content .search-logo {
    display: inline-block;
    position: relative;
    top: -10px;
    width:190px;
    height:105px;
    background-image: url("../pic/logo.png");
    /* background-size: 100% 100%; */
}

.wapper .search-wrap .search-content .search-panel {
    display:inline-block;
    width:627px;
    height:87px;
    vertical-align: top;
    margin-left:50px;   
}

.wapper .search-wrap .search-content .search-panel .search-header {
    width:627px;
    height: 62px;
}

.wapper .search-wrap .search-content .search-panel .search-header .search-top {
    height:22px;
    margin-left:17px;
}

.wapper .search-wrap .search-content .search-panel .search-header .search-top li{
    float: left;
    margin-left: 5px;
    color: #f40;
    text-align: center;
    line-height: 22px;
    height: 22px;
    width: 40px;
    font-size: 14px;
    cursor: pointer;
}

.wapper .search-wrap .search-content .search-panel .search-header .search-top li.active,
.wapper .search-wrap .search-content .search-panel .search-header .search-top li:hover {
    background: linear-gradient(to right,#ff9000 0,#ff5000 100%);
    color:#ffeee5;
    font-weight: bold;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.wapper .search-wrap .search-content .search-panel .search-header .search-form-box {
    height:40px;
    width:627px;
    position: relative;
}

.wapper .search-wrap .search-content .search-panel .search-header .search-form-box .search-form {
    display: inline-block;
    height:40px;
    width:627px;
}

.wapper .search-wrap .search-content .search-panel .search-header .search-form-box .search-form .input {
    display: inline-block;
    height:36px;
    width:550px;
    border: 2px solid #f40;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
    text-indent: 50px;
}

.wapper .search-wrap .search-content .search-panel .search-header .search-form-box .search-form .submit {
    display: block;
    float: right;
    height:40px;
    width:73px;
    border: 1px solid #f40;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    background-color: #f40;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    color: white;
}

.wapper .search-wrap .search-content .search-panel .search-header .search-form-box .pg-pic{
    display: inline-block;
    position: absolute;
    background-size: 100% 100%;
    line-height: 20px;
    width: 20px;
    height: 20px;
    margin-top: 10px;
}

.wapper .search-wrap .search-content .search-panel .search-header .search-form-box .pg-pic.searchs {
    background-image: url(../pic/fdj.png);
    left: 20px;
}

.wapper .search-wrap .search-content .search-panel .search-header .search-form-box .pg-pic.camera {
    background-image: url(../pic/camera.png);
    top: 0px;
    right: 93px;
}

.wapper .search-wrap .search-content .search-panel .search-buttom li{
    float: left;
    margin-left: 5px;
    font-size: 13px;
    color: #6c6c6c;
}

.wapper .search-wrap .search-content .search-code {
    position: absolute;
    display: inline-block;
    width:76px;
    height:87px;
    margin-left: 70px;
}

.wapper .search-wrap .search-content .search-code span {
    display: inline-block;
    width: 76px;
    height: 11px;
    text-align: center;
    font-size: 14px;
    color: black;
}

.wapper .search-wrap .search-content .search-code .code {
    display: inline-block;
    background-image: url(../pic/ewm.png);
    background-size: 100% 100%;
    width: 60px;
    height: 60px;
    margin-left: 8px;
    margin-top: 3px;
}

.wapper .search-wrap .search-content .search-code .close {
    display: inline-block;
    border: 1px solid #eee;
    font-size: 10px;
    line-height: 10px;
    text-align: center;
    width: 10px;
    height: 10px;
    position: absolute;
    left: -12px;
    top: -1px;
}

/* 导航栏 */
.wapper .screen-nav {
    width: 1190px;
    height: 30px;
    background-color: gray;
    margin: 0 auto;
}

.wapper .screen-nav .screen-nav-content {
    width: 1190px;
    height: 30px;
    position: relative;
    background: linear-gradient(to right,#ff9000 0,#ff5000 100%);
}

.wapper .screen-nav .screen-nav-content h2 {
    width: 200px;
    height: 30px;
    display: inline-block;
    float: left;
    text-align: center;
    line-height: 30px;
    background-color: #ff5000;
    font-weight: bold;
    font-size: 16px;
    color: white;
}

.wapper .screen-nav .screen-nav-content ul {
    float: left;
    display: inline-block;
    height: 30px;
}

.wapper .screen-nav .screen-nav-content ul li {
    float: left;
    display: inline-block;
    margin-left: 15px;
    height: 30px;
    position: relative;
}

.wapper .screen-nav .screen-nav-content ul li:hover::before {
    content: "";
    display:inline-block;
    width:30px;
    height:30px;
    background:url('../pic/up.png') no-repeat;
    background-size:center;
    position: absolute; 
    top:-10px;
    left:50%;
    margin-left:-15px;
}

.wapper .screen-nav .screen-nav-content ul li a {
    display: inline-block;
    height: 30px;
    text-align: center;
    line-height: 30px;
    color: white;    
    font-weight: bold;
}

/* 主要展示区域 */
.wapper .screen-box {
    width: 1190px;
    height: 632px;
    margin: 0 auto;
}

.wapper .screen-box .screen-content {
    float: left;
    width: 1190px;
    height: 632px;
}

.wapper .screen-box .screen-content .screen-left {
    float: left;
    width: 890px;
    height: 632px;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top {
    width: 890px;
    height: 522px;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-left-top-guide {
    border: 1px solid #f40;
    border-top: none;
    float: left;
    width:198px;
    height:521px;
    background-color: white;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-left-top-guide ul li{
    display: inline-block;
    height: 32px;
    width: 130px;
    padding-left: 30px;
    padding-right: 30px;
    line-height: 32px;
    position: relative;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-left-top-guide ul li a{
    font-size: 15px;
    color :#666;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-left-top-guide .guide_arrows{
    display: inline-block;
    width: 8px;
    height: 8px;
    vertical-align: center;
    background-image: url(../pic/yjt.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: absolute;
    right: 10px;
    top: 12px;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-left-top-guide ul li:hover{
    background-color:#ffe4dc;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-left-top-guide ul li:hover a{
    color: #ff5000;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-banner {
    float: left;
    width:500px;
    height:522px;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-banner .top-banner {
    margin: 10px;
    width:480px;
    height:280px;
    background-image: url("../pic/pic2.png");
    background-size: 100% 100%;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-banner .mid-ad {
    width:500px;
    height:22px;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-banner .mid-ad img{
    margin-left: 10px;
    display: inline-block;
    width:136px;
    height:19px;
    background-image: url(../pic/tm.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-banner .mid-ad span{
    margin-left: 10px;
    color: #666;
    font-size: 12px;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-banner .bottem-banner {
    margin: 10px;
    margin-bottom: 0px;
    width:480px;
    height:190px;
    background-image: url("../pic/pic3.png");
    background-size: 100% 100%;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-right-ad {
    width: 190px;
    height: 522px;
    float: right;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-right-ad .top-banner {
    margin: 10px;
    width:170px;
    height:280px;
    background-image: url("../pic/pic1.png");
    background-size: 100% 100%;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-right-ad .mid-ad {
    width:190px;
    height:22px;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-right-ad .mid-ad span{
    color: #666;
    font-size: 12px;
    margin-left: 10px;
}

.wapper .screen-box .screen-content .screen-left .screen-left-top .screen-right-ad .bottem-banner {
    margin: 10px;
    margin-bottom: none;
    width:170px;
    height:190px;
    background-image: url("../pic/pic4.png");
    background-size: 100% 100%;
}

.wapper .screen-box .screen-content .screen-left-bottom {
    width: 890px;
    height: 110px;
}

.wapper .screen-box .screen-content .screen-left-bottom .screen-content {
    background-color: #fff;
    margin: 10px;
    width: 870px;
    height: 100px;
    position: relative;
}

.wapper .screen-box .screen-content .screen-left-bottom .screen-content .taobao-top-pic {
    width: 188px;
    height: 74px;
    margin: 13px 6px;
    background-image: url(../pic/tbtt.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.wapper .screen-box .screen-content .screen-left-bottom .screen-content a {
    display: inline-block;
    position: absolute;
    left: 200px;
    top: 0px;
    height: 80px;
    width: 670px;
    margin: 10px 0;
}

.wapper .screen-box .screen-content .screen-left-bottom .screen-content a img {
    display: inline-block;
    width: 130px;
    height : 70px;
    background-image: url(../pic/pic5.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin: 5px 5px;
}

.wapper .screen-box .screen-content .screen-left-bottom .screen-content a h4 {
    line-height: 16px;
    height: 16px;
    overflow: hidden;
    display: inline-block;
    color: #333;
    margin-left: 10px;
    margin-top: 0px;
    position: absolute;
    top: 5px;
    left: 150px;
}

.wapper .screen-box .screen-content .screen-left-bottom .screen-content a h4:hover {
    color:#f40;
}

.wapper .screen-box .screen-content .screen-left-bottom .screen-content a h5 {
    line-height: 15px;
    height: 15px;
    overflow: hidden;

    max-width: 500px;
    text-overflow: ellipsis;    
    white-space: nowrap;
    display: inline-block;
    /* 省略字符测试点 */
    color: #999;
    margin-left: 10px;
    margin-top: 0px;
    position: absolute;
    top: 30px;
    left: 150px;
}

.wapper .screen-box .screen-content .screen-right {
    float: left;
    width: 300px;
    height: 632px;
}

.wapper .screen-box .screen-content .screen-right .login-info {
    width: 300px;
    height: 135px;
    margin-top: 10px;
    background-image: url(../pic/bg.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.wapper .screen-box .screen-content .screen-right .login-info .login-top {
    width: 300px;
    height: 78px;
    vertical-align: center;
    text-align: center;
}

.wapper .screen-box .screen-content .screen-right .login-info .login-top .head_pic{
    width: 300px;
    height: 56px;
}

.wapper .screen-box .screen-content .screen-right .login-info .login-top .head_pic span{
    display: inline-block;
    margin: 3px 0;
    width: 50px;
    height: 50px;
    background-image: url(../pic/tx.jpg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    line-height: 50px;
    border-radius: 50%;
}

.wapper .screen-box .screen-content .screen-right .login-info .login-top span{
    display: inline-block;
    font-size: 12px;
    color: #3c3c3c;
}

.wapper .screen-box .screen-content .screen-right .login-info .login-bottem{
    width: 300px;
    height: 16px;
    line-height: 16px;
    font-size: 12px;
    position: relative;
}

.wapper .screen-box .screen-content .screen-right .login-info .login-bottem a{
    display: inline-block;
    width: 95px;
    height: 16px;
    line-height: 16px;
    position: absolute;
    background: #ffe4db;
    border-radius: 5px;
    font-size: 12px;
    color: #f40;
    vertical-align: center;
}

.wapper .screen-box .screen-content .screen-right .login-info .login-bottem a.coin{
    position: absolute;
    left: 45px;
    text-align: center;
}

.wapper .screen-box .screen-content .screen-right .login-info .login-bottem a.club{
    position: absolute;
    left: 150px;
}

.wapper .screen-box .screen-content .screen-right .login-info .login-bottem a.coin span{
    display: inline-block;
    width: 13px;
    height: 13px;
    background-image: url(../pic/pics.png);
    background-repeat: no-repeat;
    background-position: 0 -572.5px;
}

.wapper .screen-box .screen-content .screen-right .login-info .login-bottem a.club span{
    display: inline-block;
    width: 13px;
    height: 13px;
    background-image: url(../pic/pics.png);
    background-repeat: no-repeat;
    background-position: 0 -528px
}

.wapper .screen-box .screen-content .screen-right .login-info .login-operator {
    width: 300px;
    height: 25px;
    margin: 8px 0 8px 0;
}

.wapper .screen-box .screen-content .screen-right .login-info .login-operator a{
    display: inline-block;
    width: 80px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    margin-right: 2px;
    background: linear-gradient(to right,#ff9000 0,#ff5000 100%);
    border-radius: 5px;
    color: white;
    font-weight: bold;
}

.wapper .screen-box .screen-content .screen-right .login-info .login-operator .login-operator-content{
    margin-left: 20px;
}

.wapper .screen-box .screen-content .screen-right .report {
    width: 300px;
    height: 25px;
    line-height: 25px;
    background-color: #ffe4db;
    vertical-align: center;
    text-align: center;
    position: relative;
}

.wapper .screen-box .screen-content .screen-right .report a{
    display: inline-block;
    width: 250px;
    height: 25px;
    font-size: 12px;
    color: #f40;
}

.wapper .screen-box .screen-content .screen-right .report a span{
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-left: 30px;
    background-image: url(../pic/ysj.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.wapper .screen-box .screen-content .screen-right .notify {
    width: 300px;
    height: 110px;
    background-color: white;
}

.wapper .screen-box .screen-content .screen-right .notify .tab {
    width: 300px;
    height: 20px; 
}

.wapper .screen-box .screen-content .screen-right .notify .tab ul {
    width: 280;
    height: 18px;
    margin: 0 10px;
}

.wapper .screen-box .screen-content .screen-right .notify .tab ul li{
    width: 50px;
    float: left;
    text-align: center;
    margin-right: 5px;
}

.wapper .screen-box .screen-content .screen-right .notify .tab ul li a {
    color: gray;
    font-size: 13px;
}

.wapper .screen-box .screen-content .screen-right .notify .tab ul li:hover{
    /* border-bottom: 2px solid #f40; */
}

.wapper .screen-box .screen-content .screen-right .notify .tab ul li a.active,
.wapper .screen-box .screen-content .screen-right .notify .tab ul li a:hover {
    color: black;
    font-weight: bold;
}

.wapper .screen-box .screen-content .screen-right .notify .info {
    width: 300px;
    height: 88px;
}

.wapper .screen-box .screen-content .screen-right .notify .info ul {
    width: 280px;
    height: 85px;
    margin: 0 10px;
}

.wapper .screen-box .screen-content .screen-right .notify .info ul li { 
    display: inline-block;
    width: 130px;
    height: 40px;
    line-height: 40px;
    vertical-align: center;
    margin-left: 5px;
}

.wapper .screen-box .screen-content .screen-right .notify .info ul li a{
    line-height: 40px;
    font-size: 12px;
    color: gray;
}

.wapper .screen-box .screen-content .screen-right .notify .info ul li a.active,
.wapper .screen-box .screen-content .screen-right .notify .info ul li a:hover {
    color:#F40;
}

.wapper .screen-box .screen-content .screen-right .service {
    width: 300px;
    height: 230px;
}

.wapper .screen-box .screen-content .screen-right .service ul {
    width: 100%;
    height: 100%;
    background-color: white;
}

.wapper .screen-box .screen-content .screen-right .service ul li{
    float: left;
    display: inline-block;
    width: 73px;
    height: 74px;
    border: 1px solid #f4f4f4;
}

.wapper .screen-box .screen-content .screen-right .service ul li span {
    display: inline-block;
    width:24px;
    height:24px;
    background:url('../pic/pics.png') ;
    margin-top: 10px;
    margin-left: 25px;  
}

.wapper .screen-box .screen-content .screen-right .service ul li span.pic-icon1 {
    background-position: 0 -44px;
}

.wapper .screen-box .screen-content .screen-right .service ul li span.pic-icon2 {
    background-position: 0 -88px;
}

.wapper .screen-box .screen-content .screen-right .service ul li span.pic-icon3 {
    background-position: 0 -132px;
}

.wapper .screen-box .screen-content .screen-right .service ul li span.pic-icon4 {
    background-position: 0 -176px;
}

.wapper .screen-box .screen-content .screen-right .service ul li span.pic-icon5 {
    background-position: 0 -220px;
}

.wapper .screen-box .screen-content .screen-right .service ul li span.pic-icon6 {
    background-position: 0 -264px;
}

.wapper .screen-box .screen-content .screen-right .service ul li span.pic-icon7 {
    background-position: 0 -308px;
}

.wapper .screen-box .screen-content .screen-right .service ul li span.pic-icon8 {
    background-position: 0 -342px;
}

.wapper .screen-box .screen-content .screen-right .service ul li span.pic-icon9 {
    background-position: 0 -386px;
}

.wapper .screen-box .screen-content .screen-right .service ul li span.pic-icon10 {
    background-position: 0 -430px;
}

.wapper .screen-box .screen-content .screen-right .service ul li span.pic-icon11 {
    background-position: 0 -474px;
}

.wapper .screen-box .screen-content .screen-right .service ul li span.pic-icon12 {
    background-position: 0 -518px;
}

.wapper .screen-box .screen-content .screen-right .service ul li h2 {
    height: 16px;
    line-height: 16px;
    text-align: center;
    color: black;
    font-size: 12px;
    margin-top: 5px;
}

.wapper .screen-box .screen-content .screen-right .app {
    width: 300px;
    height: 132px;
    position: relative;
}

.wapper .screen-box .screen-content .screen-right .app h2 {
    height: 32px;
    line-height: 32px;
    color: black;
    font-size: 14px;
    margin-left: 15px;
    font-weight: bold;
}

.wapper .screen-box .screen-content .screen-right .app h2 span {
    position: absolute;
    right: 15px;
    font-size: 13px;
    font-weight: 200;
}

.wapper .screen-box .screen-content .screen-right .app ul {
    width: 300px;
    height: 100px;
    background-color: white;
}

.wapper .screen-box .screen-content .screen-right .app ul li{
    float: left;
    display: inline-block;
    width: 60px;
    height: 50px;
}

.wapper .screen-box .screen-content .screen-right .app ul li a {
    display: inline-block;
    width: 40px;
    height: 40px;
    margin-left: 10px;
    margin-top: 5px;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.wapper .screen-box .screen-content .screen-right .app ul li a.pic-app1 {
    background-image: url(../pic/smalllogo1.png);
}

.wapper .screen-box .screen-content .screen-right .app ul li a.pic-app2 {
    background-image: url(../pic/smalllogo2.png);
}

.wapper .screen-box .screen-content .screen-right .app ul li a.pic-app3 {
    background-image: url(../pic/smalllogo3.png);
}

.wapper .screen-box .screen-content .screen-right .app ul li a.pic-app4 {
    background-image: url(../pic/smalllogo4.png);
}

.wapper .screen-box .screen-content .screen-right .app ul li a.pic-app5 {
    background-image: url(../pic/smalllogo5.png);
}

.wapper .screen-box .screen-content .screen-right .app ul li a.pic-app6 {
    background-image: url(../pic/smalllogo6.png);
}

.wapper .screen-box .screen-content .screen-right .app ul li a.pic-app7 {
    background-image: url(../pic/smalllogo7.png);
}

.wapper .screen-box .screen-content .screen-right .app ul li a.pic-app8 {
    background-image: url(../pic/smalllogo8.png);
}

.wapper .screen-box .screen-content .screen-right .app ul li a.pic-app9 {
    background-image: url(../pic/smalllogo9.png);
}

.wapper .screen-box .screen-content .screen-right .app ul li a.pic-app10 {
    background-image: url(../pic/smalllogo10.png);
}

